<template>
  <!-- 产品特性工单表单弹窗 -->
  <div>
    <el-dialog
      v-model="visibleDialog"
      :title="props.title"
      width="1000px"
      draggable
      align-center
      @close="closeDialog"
      class="work-dialog"
    >
      <el-tabs v-model="activeName" type="border-card">
        <el-tab-pane label="基本信息" name="first">
          <div class="flex">
            <div class="w-[680px]">
              <el-form
                ref="formRef"
                :model="formData"
                :inline="true"
                :rules="rules"
                label-width="100"
                v-show="!props.isReadonly"
              >
                <el-row>
<!--                  <el-col :span="12">-->
<!--                    <el-form-item-->
<!--                      label="工单编号"-->
<!--                      prop="orderNo"-->
<!--                      style="width: 100%"-->
<!--                    >-->
<!--                      <el-input-->
<!--                        v-if="!props.isReadonly"-->
<!--                        v-model="formData.orderNo"-->
<!--                        placeholder="请输入工单编号"-->
<!--                        clearable-->
<!--                        disabled-->
<!--                      />-->
<!--                      <span v-else>{{ formData.orderNo }}</span>-->
<!--                    </el-form-item>-->
<!--                  </el-col>-->
                  <el-col :span="12">
                    <el-form-item
                      label="工序"
                      prop="processCode"
                      style="width: 100%"
                    >
                      <el-input
                        v-if="!props.isReadonly"
                        v-model="formData.processCode"
                        placeholder="请输入工序编号"
                        clearable
                        disabled
                      />
                      <span v-else>{{ formData.processCode }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="产品型号"
                      prop="partCode"
                      style="width: 100%"
                    >
                      <el-input
                        v-if="!props.isReadonly"
                        v-model="formData.partCode"
                        placeholder="请输入零件编码(产品型号)"
                        clearable
                        disabled
                      />
                      <span v-else>{{ formData.partCode }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="工单状态"
                      prop="workOrderStatus"
                      style="width: 100%"
                    >
                      <el-input
                        v-model="formData.workOrderStatus"
                        placeholder="请输入工单状态"
                        :formatter="
                          () =>
                            useDictionary(
                              'PsmOrderStatus',
                              formData.workOrderStatus
                            )
                        "
                        disabled
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="检具编号"
                      prop="detectionEquipCode"
                      style="width: 100%"
                    >
                      <el-input
                        v-if="!props.isReadonly"
                        v-model="formData.detectionEquipCode"
                        placeholder="请输入检具编号"
                        clearable
                        disabled
                      />
                      <span v-else>{{ formData.detectionEquipCode }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="检具名"
                      prop="detectionEquipName"
                      style="width: 100%"
                    >
                      <el-input
                        v-if="!props.isReadonly"
                        v-model="formData.detectionEquipName"
                        placeholder="请输入检具名"
                        clearable
                        disabled
                      />
                      <span v-else>{{ formData.detectionEquipName }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="特性编号"
                      prop="paramCode"
                      style="width: 100%"
                    >
                      <el-input
                        v-if="!props.isReadonly"
                        v-model="formData.paramCode"
                        placeholder="请输入特性编号"
                        clearable
                        disabled
                      />
                      <span v-else>{{ formData.paramCode }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="特性描述"
                      prop="paramName"
                      style="width: 100%"
                    >
                      <el-input
                        v-if="!props.isReadonly"
                        v-model="formData.paramName"
                        placeholder="请输入特性描述"
                        clearable
                        disabled
                      />
                      <span v-else>{{ formData.paramName }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="变更时间"
                      prop="changeTime"
                      style="width: 100%"
                    >
                      <el-input
                        v-if="!props.isReadonly"
                        v-model="formData.changeTime"
                        placeholder="请输入变更时间"
                        clearable
                        disabled
                      />
                      <span v-else>{{ formData.changeTime }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item
                      label="变更描述"
                      prop="changeDescription"
                      style="width: 100%"
                    >
                      <el-input
                        v-model="changeDescription"
                        type="textarea"
                        :rows="changeDescriptionLength + 1"
                        clearable
                        disabled
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="应答时间"
                      prop="responseTime"
                      style="width: 100%"
                    >
                      <el-input
                        v-if="!props.isReadonly"
                        v-model="formData.responseTime"
                        placeholder="请输入应答时间"
                        clearable
                        disabled
                      />
                      <span v-else>{{ formData.responseTime }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="处理时间"
                      prop="processingTime"
                      style="width: 100%"
                    >
                      <el-input
                        v-if="!props.isReadonly"
                        v-model="formData.processingTime"
                        placeholder="请输入处理时间"
                        clearable
                        disabled
                      />
                      <span v-else>{{ formData.processingTime }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="第一负责人"
                      prop="responsiblePersonName"
                      style="width: 100%"
                    >
                      <el-select
                        style="width: 100%"
                        v-if="!props.isReadonly"
                        v-model="formData.responsiblePersonId"
                        placeholder="请选择第一负责人"
                        clearable
                        @change="changeResponsiblePerson"
                        :disabled="[2, 3].includes(formData.workOrderStatus)"
                      >
                        <el-option
                          v-for="item in userList"
                          :label="item.firstName"
                          :value="item.id"
                          :key="item.id"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label="实际责任人"
                      prop="actualResponsiblePersonName"
                      style="width: 100%"
                    >
                      <el-select
                        style="width: 100%"
                        v-if="!props.isReadonly"
                        v-model="formData.actualResponsiblePersonId"
                        :disabled="[0, 2].includes(formData.workOrderStatus)"
                        placeholder="请选择实际责任人"
                        clearable
                        @change="changeActualResponsiblePerson"
                      >
                        <el-option
                          v-for="item in userList"
                          :label="`${item.firstName}`"
                          :value="`${item.id}`"
                          :key="item.id"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item
                      label="变更原因"
                      prop="changeReason"
                      style="width: 100%"
                    >
                      <el-input
                        v-model="formData.changeReason"
                        type="textarea"
                        rows="2"
                        placeholder="请输入变更原因"
                        clearable
                        :disabled="[0, 2].includes(formData.workOrderStatus)"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-form>

              <el-descriptions
                :column="2"
                size="large"
                border
                v-if="props.isReadonly"
              >
<!--                <el-descriptions-item>-->
<!--                  <template #label>-->
<!--                    <div class="cell-item">工单编号</div>-->
<!--                  </template>-->
<!--                  {{ formData.orderNo || "" }}-->
<!--                </el-descriptions-item>-->
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">工序</div>
                  </template>
                  {{ formData.processCode || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">产品型号</div>
                  </template>
                  {{ formData.partCode || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">工单状态</div>
                  </template>
                  {{
                    useDictionary("PsmOrderStatus", formData.workOrderStatus) ||
                    ""
                  }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">检具编号</div>
                  </template>
                  {{ formData.detectionEquipCode || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">检具名</div>
                  </template>
                  {{ formData.detectionEquipName || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">特性编号</div>
                  </template>
                  {{ formData.paramCode || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">特性描述</div>
                  </template>
                  {{ formData.paramName || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">变更时间</div>
                  </template>
                  {{ formData.changeTime || "" }}
                </el-descriptions-item>
<!--                <el-descriptions-item />-->
                <el-descriptions-item :span="2">
                  <template #label>
                    <div class="cell-item">变更描述</div>
                  </template>
                  <div
                    v-for="(item, index) in formData.changeDescription.split(
                      ';'
                    )"
                    :key="index"
                  >
                    {{ item }}
                  </div>
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">应答时间</div>
                  </template>
                  {{ formData.responseTime || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">处理时间</div>
                  </template>
                  {{ formData.processingTime || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">第一负责人</div>
                  </template>
                  {{ formData.responsiblePersonName }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">实际责任人</div>
                  </template>
                  {{ formData.actualResponsiblePersonName }}
                </el-descriptions-item>
                <el-descriptions-item :span="2">
                  <template #label>
                    <div class="cell-item">变更原因</div>
                  </template>
                  {{ formData.changeReason }}
                </el-descriptions-item>
              </el-descriptions>
            </div>
            <div class="flex-1 ml-[20px] sort">
              <el-card shadow="never">
                <div style="display: flex; position: relative">
                  <el-timeline
                    style="
                      max-height: 450px;
                      overflow: auto;
                      padding-left: 5px;
                      width: 100%;
                    "
                  >
                    <el-timeline-item
                      v-for="(activity, index) in formData.details"
                      :key="activity.id"
                      :type="typeBack(activity)"
                      :icon="iconBack(activity)"
                      :size="'large'"
                      :timestamp="activity.processingTime"
                    >
                      <div
                        style="
                          width: 100%;
                          word-break: break-all;
                          display: flex;
                          flex-direction: column;
                        "
                      >
                        <span style="font-weight: 700; font-size: 14px">
                          {{ activity.processingUserName }}-
                          {{ activity.processingActionDescribe }}</span
                        >
                        <span> {{ activity.processingOpinion }}</span>
                      </div>
                    </el-timeline-item>
                  </el-timeline>
                  <div
                    v-if="!formData.details || !formData.details?.length"
                    class="flex justify-center m-auto mb-7"
                  >
                    <span class="">暂无操作历史</span>
                  </div>
                  <div
                    v-if="formData.details?.length"
                    style="
                      font-weight: 700;
                      font-size: 12px;
                      color: #a36c51;
                      position: absolute;
                      left: 5px;
                      top: -30px;
                      cursor: pointer;
                      height: 30px;
                      width: 50px;
                    "
                    @click="showOperationRecord"
                  >
                    <i-ep-sort />
                    排序
                  </div>
                </div>
              </el-card>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="对比" name="second" v-if="props.orderTypes.includes('featureOrder')">
          <div>
            <h4 class="mt-[10px] mb-[10px]">基本信息</h4>
            <el-descriptions :column="2" size="default" border>
              <el-descriptions-item>
                <template #label>
                  <div class="cell-item">工序</div>
                </template>
                {{ baseData.processCode || "" }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template #label>
                  <div class="cell-item">项目</div>
                </template>
                {{ baseData.projectCode || "" }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template #label>
                  <div class="cell-item">产品</div>
                </template>
                {{ baseData.modelCode || "" }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template #label>
                  <div class="cell-item">设备</div>
                </template>
                {{ baseData.equipName || "" }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template #label>
                  <div class="cell-item">检具</div>
                </template>
                {{ baseData.gageEquipMarkCode || "" }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template #label>
                  <div class="cell-item">检具名</div>
                </template>
                {{ baseData.gageEquipMarkName || "" }}
              </el-descriptions-item>
              <el-descriptions-item :span="2">
                <template #label>
                  <div class="cell-item">特性</div>
                </template>
                {{ baseData.paramName || "" }}
              </el-descriptions-item>
            </el-descriptions>
          </div>
          <div
            class="flex w-[100%] mt-[20px]"
            style="justify-content: space-between"
          >
            <div
              style="
                width: 50%;
                padding-right: 20px;
                border-right: 1px solid black;
              "
            >
              <div style="display: flex; justify-content: space-between">
                <p class="mb-[20px]">修改前</p>
                <div></div>
              </div>
              <el-descriptions
                class="w-[99%]"
                :column="1"
                size="default"
                border
              >
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">参数标准</div>
                  </template>
                  {{ beforeData.parameterStandards || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">公差下限</div>
                  </template>
                  {{ beforeData.lowerLimitValue || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">公差上限</div>
                  </template>
                  {{ beforeData.upperLimitValue || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">控制上限比例</div>
                  </template>
                  {{ beforeData.controlRatioUp || ""
                  }}{{ beforeData.controlRatioUp ? "%" : "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">控制下限比例</div>
                  </template>
                  {{ beforeData.controlRatioDown || ""
                  }}{{ beforeData.controlRatioDown ? "%" : "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">控制限上限</div>
                  </template>
                  {{ beforeData.controlUp || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">控制限下限</div>
                  </template>
                  {{ beforeData.controlDown || "" }}
                </el-descriptions-item>
              </el-descriptions>
            </div>

            <div style="width: 50%; padding: 0 2.5%">
              <div style="display: flex; justify-content: space-between">
                <p class="mb-[20px]">修改后</p>
                <div></div>
              </div>
              <el-descriptions
                class="w-[99%]"
                :column="1"
                size="default"
                border
              >
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">参数标准</div>
                  </template>
                  {{ afterData.parameterStandards || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">公差下限</div>
                  </template>
                  {{ afterData.lowerLimitValue || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">公差上限</div>
                  </template>
                  {{ afterData.upperLimitValue || "" }}
                </el-descriptions-item>
                <el-descriptions-item label-width="140">
                  <template #label>
                    <div class="cell-item">控制上限比例</div>
                  </template>
                  {{ afterData.controlRatioUp || ""
                  }}{{ afterData.controlRatioUp ? "%" : "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">控制下限比例</div>
                  </template>
                  {{ afterData.controlRatioDown || ""
                  }}{{ afterData.controlRatioDown ? "%" : "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">控制限上限</div>
                  </template>
                  {{ afterData.controlUp || "" }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template #label>
                    <div class="cell-item">控制限下限</div>
                  </template>
                  {{ afterData.controlDown || "" }}
                </el-descriptions-item>
              </el-descriptions>
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>

      <template #footer>
        <div class="dialog-footer">
          <el-button
            v-if="!props.isReadonly && formData.workOrderStatus === 0"
            type="primary"
            :loading="loading"
            @click="accept"
            >接受工单
          </el-button>
          <el-button
            v-if="!props.isReadonly && formData.workOrderStatus === 1"
            type="primary"
            :loading="loading"
            @click="close"
            >关闭工单
          </el-button>
          <el-button
            v-if="!props.isReadonly && formData.workOrderStatus === 2"
            type="primary"
            :loading="loading"
            @click="rejected"
            >驳 回
          </el-button>
          <el-button
            v-if="!props.isReadonly && formData.workOrderStatus === 1"
            type="primary"
            :loading="loading"
            @click="handleSubmit"
            >确 定
          </el-button>
          <el-button @click="closeDialog">取 消</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">
import request from "@/utils/request";
import { useDictStoreHook } from "@/store/modules/dictionary";
import {
  ChatLineSquare,
  Check,
  EditPen,
  RefreshRight,
} from "@element-plus/icons-vue";
import { useDictionary } from "@/utils/useTable";
import PACINDEMNITYPROCESSINNERDETAILCOMMON from "@/views/pac/common/pacindemnityprocessinnerdetailcommon.vue"; // 引入
const dictionaryStore = useDictStoreHook();

defineOptions({
  name: "PCMQDPRODUCTFEATUREORDERADDORUPDATE",
  inheritAttrs: false,
});

const emit = defineEmits(["reset-table", "change-visible"]);

const props = defineProps({
  visible: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
  title: {
    type: String,
    default: () => {
      return "";
    },
  },
  data: {
    type: Object,
    default: () => {
      return {};
    },
  },
  isReadonly: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
  orderTypes: {
    type: Array,
    default: ["featureOrder"],
  },
});

const baseData = reactive({
  processCode: "",
  projectCode: "",
  modelCode: "",
  equipName: "",
  gageEquipMarkCode: "",
  gageEquipMarkName: "",
  paramName: "",
});
const beforeData = reactive({
  parameterStandards: "",
  lowerLimitValue: "",
  upperLimitValue: "",
  controlRatioUp: "",
  controlRatioDown: "",
  controlUp: "",
  controlDown: "",
});
const afterData = reactive({
  parameterStandards: "",
  lowerLimitValue: "",
  upperLimitValue: "",
  controlRatioUp: "",
  controlRatioDown: "",
  controlUp: "",
  controlDown: "",
});

/** 弹窗显示 **/
const visibleDialog = ref(false);
watch(
  () => props.visible,
  (newVal: boolean) => {
    visibleDialog.value = newVal;
    setTimeout(() => {
      formRef.value.clearValidate();
    }, 50);
  }
);

const changeDescription = computed(() =>
  formData.changeDescription.replaceAll(";", "\n")
);
const changeDescriptionLength = computed(
  () => formData.changeDescription.split(";").length
);

/** formData定义表单数据 */
const formRef = ref(ElForm);
let formData = reactive({
  id: "",
  orderNo: "",
  processId: "",
  processCode: "",
  partCode: "",
  detectionEquipCode: "",
  detectionEquipName: "",
  paramId: "",
  paramCode: "",
  paramName: "",
  changeDescription: "",
  changeContent: "",
  responseTime: "",
  processingTime: "",
  responsiblePersonId: "",
  responsiblePersonName: "",
  actualResponsiblePersonId: "",
  actualResponsiblePersonName: "",
  changeReason: "",
  enabled: "",
  deleted: "",
  createTime: "",
  createdUserId: "",
  createdUserName: "",
  lastUpdatedUserId: "",
  lastUpdatedUserName: "",
  lastUpdateTime: "",
  workOrderStatus: "",
  changeTime: "",
  details: [
    {
      id: "",
      version: "",
      processingInstanceId: "",
      processingCategory: "",
      processingUserId: "",
      processingUserName: "",
      processingAction: "",
      processingActionDescribe: "",
      processingOpinion: "",
      processingTime: "",
      deleted: "",
      createTime: "",
      createdUserId: "",
      createdUserName: "",
      lastUpdateTime: "",
      lastUpdatedUserId: "",
      lastUpdatedUserName: "",
    },
  ],
});

/** rules规则 */
const rules = reactive({
  orderNo: [],
  processId: [],
  processCode: [],
  partCode: [],
  detectionEquipCode: [],
  detectionEquipName: [],
  paramCode: [],
  paramName: [],
  changeDescription: [],
  responseTime: [],
  processingTime: [],
  responsiblePersonName: [],
  actualResponsiblePersonName: [],
  changeReason: [],
  workOrderStatus: [],
  changeTime: [],
  sonprocessingCategory: [],
  sonprocessingUserId: [],
  sonprocessingUserName: [],
  sonprocessingAction: [],
  sonprocessingActionDescribe: [],
  sonprocessingOpinion: [],
  sonprocessingTime: [],
});

const isValidated = ref(false);

const details = {
  id: "",
  version: "",
  processingInstanceId: "",
  processingCategory: "",
  processingUserId: "",
  processingUserName: "",
  processingAction: "",
  processingActionDescribe: "",
  processingOpinion: "",
  processingTime: "",
  deleted: "",
  createTime: "",
  createdUserId: "",
  createdUserName: "",
  lastUpdateTime: "",
  lastUpdatedUserId: "",
  lastUpdatedUserName: "",
};

/** 编辑时赋值 */
watch(
  () => props.data,
  (newVal: any) => {
    formData.id = "";
    if (newVal?.id) {
      Object.assign(formData, props.data);
      if (formData.changeContent) {
        const parse = JSON.parse(formData.changeContent);
        Object.assign(baseData, parse.before);
        Object.assign(beforeData, parse.before);
        Object.assign(afterData, parse.after);
      }
      if (formData.id) {
        getdetails();
      }
    }
  }
);

/** 关闭表单弹窗 */
function closeDialog() {
  visibleDialog.value = false;
  emit("change-visible", false);
  resetForm();
  resetBaseData();
}

/** 重置表单 */
function resetForm() {
  formRef.value.resetFields();
  formRef.value.clearValidate();
  formData.details = [JSON.parse(JSON.stringify(details))];
  formData.id = "";
  formData.orderNo = "";
  formData.processId = "";
  formData.processCode = "";
  formData.partCode = "";
  formData.detectionEquipCode = "";
  formData.detectionEquipName = "";
  formData.paramId = "";
  formData.paramCode = "";
  formData.paramName = "";
  formData.changeDescription = "";
  formData.changeContent = "";
  formData.responseTime = "";
  formData.processingTime = "";
  formData.responsiblePersonId = "";
  formData.responsiblePersonName = "";
  formData.actualResponsiblePersonId = "";
  formData.actualResponsiblePersonName = "";
  formData.changeReason = "";
  formData.enabled = "";
  formData.deleted = "";
  formData.createTime = "";
  formData.createdUserId = "";
  formData.createdUserName = "";
  formData.lastUpdatedUserId = "";
  formData.lastUpdatedUserName = "";
  formData.lastUpdateTime = "";
  formData.workOrderStatus = "";
  formData.changeTime = "";
}
/** 重置表单 */
function resetBaseData() {
  baseData.processCode = "";
  baseData.projectCode = "";
  baseData.modelCode = "";
  baseData.equipName = "";
  baseData.gageEquipMarkCode = "";
  baseData.gageEquipMarkName = "";
  baseData.paramName = "";
  beforeData.parameterStandards = "";
  beforeData.lowerLimitValue = "";
  beforeData.upperLimitValue = "";
  beforeData.controlRatioUp = "";
  beforeData.controlRatioDown = "";
  beforeData.controlUp = "";
  beforeData.controlDown = "";
  afterData.parameterStandards = "";
  afterData.lowerLimitValue = "";
  afterData.upperLimitValue = "";
  afterData.controlRatioUp = "";
  afterData.controlRatioDown = "";
  afterData.controlUp = "";
  afterData.controlDown = "";
}

const loading = ref(false);

/** 产品特性工单保存提交 */
function handleSubmit() {
  formRef.value.validate(async (valid: any) => {
    if (valid) {
      loading.value = true;
      const text = formData.id ? "编辑" : "新增";
      await request({
        url: "/dmpDosPcm/qdproductfeatureorder/save",
        method: "post",
        data: formData,
      }).finally(() => {
        loading.value = false;
      });
      ElMessage.success(text + `成功`);
      closeDialog();
      emit("reset-table", formData.id);
      isValidated.value = false;
    } else {
      isValidated.value = true;
    }
  });
}

async function getdetails() {
  let sondetails = await request({
    url: "/dmpDosPcm/qdproductfeatureorder/getDetails",
    method: "post",
    data: formData,
  }).finally(() => {
    loading.value = false;
  });
  formData.details = sondetails.data;
}

// 返回图标
const iconBack = (data) => {
  if (data.processingAction == "create") {
    return ChatLineSquare;
  } else if (data.processingAction == "rejected") {
    return RefreshRight;
  } else if (data.processingAction == "accept") {
    return Check;
  } else {
    return "";
  }
};
// 返回类型
const typeBack = (data) => {
  if (data.processingAction == "create") {
    return "primary";
  } else if (data.processingAction == "rejected") {
    return "danger";
  } else if (data.processingAction == "accept") {
    return "success";
  } else {
    return "";
  }
};

// 排序
const showOperationRecord = () => {
  if (formData.details?.length > 0) {
    formData.details.reverse();
  }
};
// 负责人
const userList = ref<any>([]);
const getUserList = async () => {
  await request({
    url: "/system/sysUser/getList",
    method: "post",
    data: { enabled: 1 },
  }).then((res) => {
    userList.value = res.data;
  });
};

const changeActualResponsiblePerson = (id) => {
  const find = userList.value.find((item) => item.id === id);
  formData.actualResponsiblePersonName = find?.firstName || "";
};
const changeResponsiblePerson = (id) => {
  const find = userList.value.find((item) => item.id === id);
  formData.responsiblePersonName = find?.firstName || "";
};

onMounted(async () => {
  await getUserList();
});
const accept = async () => {
  loading.value = true;
  await request({
    url: "/dmpDosPcm/qdproductfeatureorder/accept",
    method: "post",
    data: formData,
  }).finally(() => {
    loading.value = false;
  });
  ElMessage.success(`接受成功`);
  closeDialog();
  emit("reset-table", formData.id);
};

const close = async () => {
  formRef.value.validate(async (valid: any) => {
    if (valid) {
      ElMessageBox.confirm("确定关闭此工单吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        buttonSize: "default",
        type: "warning",
      }).then(async () => {
        loading.value = true;
        await request({
          url: "/dmpDosPcm/qdproductfeatureorder/close",
          method: "post",
          data: formData,
        }).finally(() => {
          loading.value = false;
        });
        ElMessage.success(`关闭成功`);
        closeDialog();
        emit("reset-table", formData.id);
      });
    }
  });
};

const rejected = async () => {
  ElMessageBox.confirm("确定驳回此工单吗？", "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    buttonSize: "default",
    type: "warning",
  }).then(async () => {
    loading.value = true;
    await request({
      url: "/dmpDosPcm/qdproductfeatureorder/rejected",
      method: "post",
      data: formData,
    }).finally(() => {
      loading.value = false;
    });
    ElMessage.success(`驳回成功`);
    closeDialog();
    emit("reset-table", formData.id);
  });
};

const activeName = ref("first");
</script>

<style lang="scss" scoped>
:deep(.el-descriptions__label.el-descriptions__cell.is-bordered-label) {
  width: 120px;
}

:deep(.el-descriptions__content.el-descriptions__cell.is-bordered-content) {
  min-width: 120px;
}

:deep(.work-dialog .el-dialog__body) {
  max-height: 65vh;
  overflow-y: auto;
  padding: 20px;
}

.link {
  margin: 0 5px;
  cursor: pointer;
  font-size: 13px;
  color: #409eff;
}

.red {
  color: #f56c6c !important;
}

:deep(.sort .el-card__body) {
  padding: 45px 10px 10px !important;
}
</style>
